import React, { PureComponent } from 'react';
import { Modal, List, InputItem, WhiteSpace, Button, WingBlank, Menu, ActivityIndicator, NavBar, TabBar, Card, Flex } from 'antd-mobile';
import { connect } from 'dva';
import ast from './index.less';
import md5 from 'md5'
import { setCookie } from '../../utils/auth'
import { createForm, formShape } from 'rc-form';
import { Divider } from 'antd';
const PlaceHolder = ({ className = '', ...restProps }) => (
  <div className={`${className} placeholder`} {...restProps}>Block</div>
);
const Item = List.Item;
class MentorIndex extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      initData: '',
      show: false,
      selectedTab: 'redTab',
      hidden: false,
      fullScreen: false
    };
  }
  componentWillMount() {
    this.props.dispatch({ type: "mentorIndexMoudule/tutorStuAnalysis", payload: {} })
    this.props.dispatch({ type: "mentorIndexMoudule/loadSysMessageScope", payload: {
      msgType:2
    } })
    
}
  onChange = (value) => {
    let label = '';
  }
  handleClick = (e) => {
    e.preventDefault(); // Fix event propagation on Android
    this.setState({
      show: !this.state.show,
    });
  }

  onMaskClick = () => {
    this.setState({
      show: false,
    });
  }

  render() {
    const { initData, show } = this.state;
    const loadingEl = (
      <div style={{ width: '100%', height: document.documentElement.clientHeight * 0.6, display: 'flex', justifyContent: 'center' }}>
        <ActivityIndicator size="large" />
      </div>
    );
    return (
      <div className={show ? ast.menu_active : ''}>
        <div><img src={require('../../assets/banner.jpg')} className={ast.banner} /></div>
        <WingBlank size="lg" >
          <WhiteSpace size="lg" />
          <Card>
            <Card.Header
              title="通知公告"
              thumb="https://gw.alipayobjects.com/zos/rmsportal/MRhHctKOineMbKAZslML.jpg"
            />
            <Card.Body>
              {/* <div className={ast.card}>
                <div>我的学号：{this.props.studentInfo.Msg.username}</div>
                <div>我的专业：{this.props.studentInfo.Msg.orgName}</div>
                <div>我的导师：</div>
                <div>一卡通号：032018010101</div>
                <div>我的题目：基于云计算的文字识别算法研究和实现</div>
              </div> */}
              {this.props.messignList == undefined ? null : this.props.messignList.map((s,key) =>{
                return(
                <List className="my-list">
                <Item extra={s.createDate} multipleLine align="top" wrap>
               {s.msgTheme}
                </Item>
              </List>
              )
              })}
              
            </Card.Body>
          </Card>
          <WhiteSpace size="lg" />
          {this.props.loadStuInfoList == undefined ? null : this.props.loadStuInfoList.map((s,key) =>{
            return(
              <div key={key} size="lg" className={ast.listCard}>
              <div className={ast.listCardBg}>
                {s.name}
                <p>{`${s.grade}级`}</p>
                <p style={{display:'block',padding:'0px',margin:'10px 0px 0px 0px'}}>{s.subjectTitle == "" ? '暂无题目' : s.subjectTitle}</p>
               </div>
              <div className={ast.listCardBox}>
                <div className={ast.listCardIcon}>
                  {s.ResTeaStuSel == 1 ? <img src={require('../../assets/icon/mentorIndex_icon1_G.png')} /> : <img src={require('../../assets/icon/mentorIndex_icon1_R.png')} />}
                  <div>师生双选</div> 
                </div>
                <div className={ast.listCardIcon}>
                {s.resTrainPlan == 1 ? <img src={require('../../assets/icon/mentorIndex_icon1_G.png')} /> : <img src={require('../../assets/icon/mentorIndex_icon1_R.png')} />}
                 
                  <div>培养计划</div>
                </div>
                <div className={ast.listCardIcon}>
                {s.resPractise == 1 ? <img src={require('../../assets/icon/mentorIndex_icon2_G.png')} /> : <img src={require('../../assets/icon/mentorIndex_icon2_R.png')} />}
                  <div>实践</div>
                </div>
                <div className={ast.listCardIcon}>
                {s.resOpening == 1 ? <img src={require('../../assets/icon/mentorIndex_icon3_G.png')} /> : <img src={require('../../assets/icon/mentorIndex_icon3_R.png')} />}
                  <div>开题</div>
                </div>
                <div className={ast.listCardIcon}>
                {s.resMidterm == 1 ? <img src={require('../../assets/icon/mentorIndex_icon4_G.png')} /> : <img src={require('../../assets/icon/mentorIndex_icon4_R.png')} />}                 
                  <div>中期</div>
                </div>
                <div className={ast.listCardIcon}>
                {s.resDefense == 1 ? <img src={require('../../assets/icon/mentorIndex_icon5_G.png')} /> : <img src={require('../../assets/icon/mentorIndex_icon5_R.png')} />}                                   
                  <div>答辩</div>
                </div>
                <div className={ast.listCardIcon}>
                {s.resGraduate == 1 ? <img src={require('../../assets/icon/mentorIndex_icon6_G.png')} /> : <img src={require('../../assets/icon/mentorIndex_icon6_R.png')} />}                                   
                  
                  <div>学历</div>
                </div>
                <div className={ast.listCardIcon}>
                {s.resDegreeApply == 1 ? <img src={require('../../assets/icon/mentorIndex_icon6_G.png')} /> : <img src={require('../../assets/icon/mentorIndex_icon6_R.png')} />}                                                     
                  <div>学位</div>
                </div>
              </div>
          </div>
            )
          }) }
         
        </WingBlank>
      </div>

    );
  }
}
function mapStateToProps(state) {
  return {
    messignList: state.mentorIndexMoudule.loadSysMessageList.rows,
    loadStuInfoList:state.mentorIndexMoudule.tutorStuAnalysiList.hashMapList
  }
}
export default connect(mapStateToProps)(MentorIndex);
